import { fileURLToPath, URL } from 'node:url'
// 导入 loadEnv
import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
// 向 defineConfig 传递对象改为传递方法，并返回配置对象
export default defineConfig(({ mode }) => {
  // mode：获取 --mode 指定的模式，process.cwd() 项目根目录
  // 下面 env 相当于 import.meta.env
  const env = loadEnv(mode, process.cwd())
  return {
    // 开发服务器选项
    server: {
      open: true, // 启动服务时自动打开浏览器访问
      port: 8888, // 端口号，如果端口号被占用，会自动提升 1
      proxy: { // 解决跨域问题
        // '/dev-api': { // 匹配 /dev-api 开头的请求
        [env.VITE_APP_BASE_API]: { // 导用变量作为key时，要加中括号[]
          // 目标服务器，代理访问到
          // target: 'https://mock.mengxuegu.com/mock/669e3fb3f7321d15f1d5321c/mxg-vue3-elementplus',
          target: env.VITE_APP_SERVICE_URL,
          // 开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，
          // 这样服务端和客户端进行数据的交互就不会有跨域问题
          changeOrigin: true,
          // 将 /dev-api 替换为 '' ，也就是 /dev-api 会移除
          // rewrite: (path) => path.replace(/^\/dev-api/, '')
          rewrite: (path) => path.replace(new RegExp(`^${env.VITE_APP_BASE_API}/`), '')
        }
      }
    },
    plugins: [
      vue(),
    ],
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url))
      }
    }
  }
})
